<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的会员</title>
    <link rel="stylesheet" type="text/css" href="../css/pluginsExt/userCenter/reset.css">
    <link rel="stylesheet" type="text/css" href="../../resources/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="../css/pluginsExt/userCenter/global.css">
    <link rel="stylesheet" type="text/css" href="../css/pluginsExt/userCenter/userCom.css">
    <link rel="stylesheet" type="text/css" href="../css/pluginsExt/userCenter/user.css">
    <link rel="stylesheet" href="../css/pluginsExt/userCenter/userMember.css">
</head>
<body>
<div class="shop-header">
    <div class="wrapper clearfix">
        <ul class="fl clearfix shopNav">
            <li><a href="tea-index.html">优茶首页</a></li>
            <li><a href="javascript:void(0);">茶叶</a></li>
            <li><a href="javascript:void(0);">茶器</a></li>
            <li><a href="javascript:void(0);">茶点</a></li>
            <li><a href="javascript:void(0);">杂志</a></li>
            <li><a href="javascript:void(0);">考级</a></li>
        </ul>
        <!-- 已登录时，不显示登录及注册 -->
        <div class="fr login">
            <a href="javascript:void(0);">登录</a>
            <span class="marLR10">|</span>
            <a href="javascript:void(0);">注册</a>
        </div>
        <!-- end -->
        <div class="fr">
            <a href="javascript:void(0);" class="h-head"><img src="../img/userCenter/ico/h-head.png"><span>用户中心</span></a>
            <a href="javascript:void(0);" class="h-car"><img src="../img/userCenter//ico/h-car.png"><span>购物车</span></a>
        </div>
    </div>
</div>
<!--用户中心 头部-->
<div class="userTop" style="background:url(../img/userCenter/user_bg.jpg) no-repeat center">
    <span class="welcome">欢迎来到<em>优茶</em>用户中心</span>
</div>
<div class="wrapper user_head">
    <img src="../img/userCenter/test/sp.jpg" class="borderRadius" />
</div>

<div class="wrapper clearfix user_content">
    <!-- 左边栏 -->
    <ul class="fl userSide">
        <li><a href="javascript:void(0);" class="icon u-sign">我的积分</a></li>
        <li  class="on"><a href="javascript:void(0);" class="icon u-sign">我的会员</a></li>
        <li><a href="javascript:void(0);" class="icon u-car">购物车</a></li>
        <li><a href="javascript:void(0);" class="icon u-order">订单</a></li>
        <li><a href="javascript:void(0);" class="icon u-addr">收货地址</a></li>
        <li><a href="javascript:void(0);" class="icon u-card">优惠券</a></li>
        <li><a href="javascript:void(0);" class="icon u-coll">收藏/关注</a></li>
        <li><a href="tea-userSet.html" class="icon u-set">个人设置</a></li>
    </ul>
    <div class="fr rightBox"  style="overflow-x: hidden">
        <h2 class="marB5 font14 color60 userTit">我的会员</h2>
        <div class="all_order whiteBg" id="myMember">
            <ul class="MemTop clearfix">
                <li class="Memlevel">
                    <span class="font16 fontBlod"><b>{{levelName}}</b></span>
                </li>
                <li class="Memint">
                    <span class="myIntegral">
                        累计积分：
                        <b class="integral font24 fontBlod">
                            <span>{{cumtrapz}}</span>
                        </b>
                        <br>
                        <span> 优茶 <b class="fontBlod">{{levelName}}</b> 会员</span>
                    </span>
                    <br>
                </li>
                <li class="Memsur">
                    <span>已经超过 <b class="font20 fontBlod"><span>{{rank}}</span></b> 的会员</span>
                </li>
            </ul>
            <div class="MemMid clearfix">
                <div class="MidUpgrade"></div>
                <ul class="Midplan clearfix">
                    <li v-for="(value, key) in level" class="li-plan">
                        <span class="fontBlod">{{value.levelCond}}</span>
                        <p class="fontBlod">{{value.levelName}}</p>
                        <div class="bar active">
                        </div>
                    </li>
                </ul>
            </div>
            <div class="MemBtm">
                <table class="fontBlod">
                    <thead>
                        <tr>
                            <th width="20%">会员等级</th>
                            <th width="80%">会员福利</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(value,key) in level">
                            <td>{{value.levelName}}</td>
                            <td>
                                <span v-for="(value,key) in value.listMemberWeal">
                                    <i  v-if="(value.flag == 'Y')" class="fa fa-check-circle"> </i>
                                    <i  v-if="(value.flag == 'N')" class="fa fa-times-circle"> </i>
                                    {{value.wealName}}
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<div class="cooperation">

</div>
</body>
<script src="../../resources/js/jquery-2.1.1.js"></script>
<script src="../js/pluginsExt/footer/All-footer.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js"></script>
<script src="../js/pluginsExt/userCenter/userMember.js"></script>
</html>